<!--
 * @Description: file content
 * @Author: oooh
 * @Date: 2024-04-26 19:24:33
 * @LastEditors: oooh
 * @LastEditTime: 2024-04-27 16:01:01
 * @FilePath: \Civil_Servant_Performance_PC\src\views\work-approval\negative\index.vue
-->
<template>
  <div class="app-container">
    <el-tabs v-model="activeName" type="card" @tab-click="handleTabChange">
      <el-tab-pane label="站办所" name="dept"> </el-tab-pane>
      <el-tab-pane label="个人" name="civil"></el-tab-pane>
    </el-tabs>
    <component :is="dynamicComponent"></component>
  </div>
</template>

<script>
import deptComponent from './dept'
import civilComponent from './civil'
export default {
  name: 'negative',
  props: {},
  components: { deptComponent, civilComponent },
  data() {
    return {
      activeName: 'dept',
      dynamicComponent: 'deptComponent'
    }
  },
  computed: {},
  watch: {},
  methods: {
    // 选中标签改变
    handleTabChange(tab) {
      if (tab.name === 'dept') {
        this.dynamicComponent = 'deptComponent'
      } else if (tab.name === 'civil') {
        this.dynamicComponent = 'civilComponent'
      }
    }
  }
}
</script>

<style lang="scss" scoped>
::v-deep .el-date-editor {
  width: auto;
}

::v-deep .el-input-number {
  width: auto;
}
</style>
